---
id: angle-slider
title: Angle Slider
description: A component for selecting a value within a circular range.
---

<ComponentPreview id="AngleSlider" />

## Examples

### Basic

Here's a basic example of the Angle Slider component.

<Example id="basic" />

### Controlled

Use the `value` and `onValueChange` props to control the value of the Angle Slider.

<Example id="controlled" />

### Steps

Use the `step` prop to set the discrete steps of the Angle Slider.

<Example id="step" />

## API Reference

### Props

<ComponentTypes id="angle-slider" />

### Context

These are the properties available when using `AngleSlider.Context`, `useAngleSliderContext` hook or `useAngleSlider`
hook.

<ContextType id="angle-slider" />
